<template>
    <div class="box">
        <div class="box1">
            <!-- 邮箱和密码 -->
            <el-form :rules="rules" label-width="80px" :model="formLabelAlign" class="email">
                <!-- 邮箱 -->
                <el-form-item label="邮箱" prop="email">
                    <el-input v-model="formLabelAlign.email" style="width:450px"></el-input>
                </el-form-item>
                <!-- 密码 -->
                <el-form-item label="密码" prop="password">
                    <el-input v-model="formLabelAlign.password" style="width:450px"></el-input>
                </el-form-item>
            </el-form>
            <!-- 小眼睛 -->
            <i class="el-icon-view el-icon--right aaa" disabled></i>

            <el-button type="primary" size="mini" class="an" @click="list">登录</el-button>
        </div>
    </div>
</template>

<script>
export default {
    name: 'A1Login',
    data() {
        return {
            disabled: false,
            formLabelAlign: {
                email:'super@a.com',
                password:'123123'
            },
            rules: {
                email: [
                    { required: true, message: '请输入邮箱账号', trigger: 'blur' },
                ],
                password: [
                    { required: true, message: '请输入账号密码', trigger: 'blur' },
                ],
            }
        };
    },

    mounted() {
         
    },

    methods: {
        list(){
            this.$axios.post('https://api.shop.eduwork.cn/api/auth/login',this.formLabelAlign).then(res=>{
                console.log(res);
                if(res.status==200){
                    localStorage.token=res.data.access_token
                    this.$message.success('登录成功')
                    this.$router.push('/left')
                }else{
                    this.$message.error('登录失败')
                }
            })
        }
    },
};
</script>

<style   scoped>
.box {
    width: 96pc;
    height: 45pc;
    background: #f3f3fa;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    padding-top: 20px;
}

.box1 {
    width: 650px;
    height: 300px;
    background: white;
    border-radius: 15px 15px 15px 15px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.aaa {
    position: absolute;
    left: 990px;
    top: 378px;
    color: #cccc;
}
.an {
    position: absolute;
    left: 582px;
    top: 437px;
}
</style>